<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>        
<script src="/whereismyteacher-c/WebContent/js/jquery-1.9.1.js"></script>
<script src="/whereismyteacher-c/WebContent/js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript">	
	$(document).ready(function(){
		//마우스 위치 저장할 변수
//		var x = null; 
//		var y = null; 
// 검색조건저장할 변수
		var grade_name="";
		var grade_grade="";
//		var grade_grade_text;	//셀렉트에 선택된 학교학년을 저장
		//초기에 화면에 뿌려줄 내용
		$.ajax({
			type:"POST",
			url:"hopeSubjectList.do",
			dataType:"json",
			success:function(jsonData){	
 				//학교학년 가져와서 뿌리기
				$("#grade_grade option").remove();
				var op="<option value=''>--</option>";
				$("#grade_grade").append(op);
 				$.each(jsonData.gradeList,function(index, gradelist){
 					op="<option value="+gradelist.code_code+">"+gradelist.code_name+"</option>";
					$("#grade_grade").append(op); 					
				});
			}//success
		});//ajax

		$("#grade_searchBtn").click(function(){
			grade_name=$("#grade_name").val();
			grade_grade=$("#grade_grade").val();
			if(grade_grade=="" && grade_name==""){
				alert("검색조건을 입력하세요.");
			}else{	//조건에 따른 검색
				$.ajax({
					type:"post",
					url:"getSearchStudentbyGrade.do",
					data:"grade_name="+grade_name+"&grade_grade="+grade_grade,  //	data:$("#tradeForm").serialize(),
					dataType:"json",
					success:function(jsonData){
						var member_table="";
//						alert("검색조건 성공!!"+jsonData.list[0].hopesubject);
						if(jsonData.list.length>=1){	//검색결과 1명이상이면
							$("#grade_totalstudent").text("검색결과 총 학생 수 : "+jsonData.list.length);
							$("#listbygrade tbody").text("");	//기존의 내용을 지운다.
	 		 				$.each(jsonData.list,function(index, mvo){
	 		 					member_table  = "<tr><td align='center'>"+mvo.name +"</td>"+
	 		 													"<td align='center'>"+mvo.grade +"</td>"+
	 		 													"<td align='center'>"+mvo.gender +"</td>"+
	 		 													"<td align='center'>"+mvo.hoperegion +"</td>"+
	 		 													"<td align='center'>"+mvo.hopesubject +"</td></tr>";
	 							$("#grade_memberlist_Tbody").append(member_table);				
							});
							$("#grade_grade").val("");	//검색완료 후 초기화(학년셀렉트박스)
							$("#grade_name").val("");		//검색완료 후 초기화(이름)
						}else{	//검색결과가 0명이면
							alert("검색조건에 맞는 학생이 없습니다.");
						}						
					}
				});			//ajax	
			}	//if
		});	//click

	    $( "#dialog_studendInfo" ).dialog({
	        autoOpen: false,
	        show: {effect: "blind", duration: 100},
	        hide: {effect: "explode", duration: 100}
//	        position: [x,y+10]
	      });
		
		//학생 이름 클릭되면
 		$("a[id=studentName]").click(function(e){ 
//			alert($(this).next().val());
//			x = e.clientX; y = e.clientY;

			var studentId=$(this).next().val();
			var information="";
			$.ajax({
				type:"POST",
				url:"getStudentInfobyId.do",
				data:"studentId="+studentId,  //	data:$("#tradeForm").serialize(),
				dataType:"json",
				success:function(jsonData){
//					alert("success : "+jsonData.name);
					$("#p_studendInfo").text("");	//기존의 내용을 지운다.
					information  = '이름 : '+jsonData.name+'<br>'+
										  '과외지역 : '+jsonData.hoperegion+'<br>'+
										  '과외과목 : '+jsonData.hopesubject+'<br>'+
										  '학교학년 : '+jsonData.grade+'<br>'+
										  '전화번호 : '+jsonData.tel+'<br>'+
										  '이메일 : '+jsonData.email+'<br>'+
										  '주소 : '+jsonData.codeaddress+jsonData.subaddress+'<br>';	 													
 					$("#dialog_studendInfo	").html(information);
 					$( "#dialog_studendInfo" ).dialog( "open" );
 					
				}	//success
			});	//ajax 			
		});
		
		//페이지 번호 클릭시
		$("a[id=pageList]").click(function(){
			var pageTable="";
			var pageNo=$(this).text();
//			alert("페이지로 : "+$(this).text());
			if(grade_grade=="" && grade_name==""){
				//검색조건없이 현재탭의 페이지를 이동
				$.ajax({
					type:"POST",
					url:"tabStudentGradeViewPageN.do", // tab 클릭했을 때 실행하는 메서드와 동일한데 리턴값다르게
					data:"pageNo="+pageNo,  //	data:$("#tradeForm").serialize(),
					dataType:"json",
					success:function(jsonData){
						$("#grade_totalstudent").text("검색결과 총 학생 수 : "+jsonData.list.length);
						$("#listbygrade tbody").text("");	//기존의 내용을 지운다.
	 		 			$.each(jsonData.list,function(index, mvo){
	 		 				member_table  = "<tr><td align='center'>"+mvo.name +"</td>"+
	 		 												"<td align='center'>"+mvo.hoperegion +"</td>"+
	 		 												"<td align='center'>"+mvo.grade +"</td>"+
	 		 												"<td align='center'>"+mvo.gender +"</td>"+
	 		 												"<td align='center'>"+mvo.hopesubject +"</td></tr>";	 													
	 						$("#grade_memberlist_Tbody").append(member_table); 						
						});	//each

						//페이징처리시작
						//	alert("현재페이지 :"+jsonData.pagingBean.nowPage);
						$("#pagingView").text("");	//기존의 내용을 지운다.
						if(jsonData.pagingBean.previousPageGroup){
							pageTable="<a href='tabStudentRegionView.do?pageNo='"+(jsonData.pagingBean.startPageOfPageGroup-1) +"id='prePage' >이전 </a>";
						}
						for( i=jsonData.pagingBean.startPageOfPageGroup; i<=jsonData.pagingBean.endPageOfPageGroup; i++){
							if(jsonData.pagingBean.nowPage !=i){
								pageTable+="<a id='pageList'>"+ i +"</a>";
							}else{
								pageTable+=i;	//링크없이 페이지번호만 표시
							}
						}//for
						if(jsonData.pagingBean.nextPageGroup){
							pageTable+="<a href='tabStudentRegionView.do?pageNo='"+(jsonData.pagingBean.endPageOfPageGroup+1) +" id='postPage' >	다음 </a>";
						}							
						$("#pagingView").append(pageTable); 		
						//페이징처리 끝
					}	//success
				});	//ajax	
			}else{	//검색조건에 따른 페이지 이동
				$.ajax({
					type:"POST",
					url:"getSearchStudentbyGrade.do",
					data:"pageNo="+pageNo+"&grade_name="+grade_name+"&grade_grade="+grade_grade,   //	data:$("#tradeForm").serialize(),
					dataType:"json",
					success:function(jsonData){
						alert(jsonData.list.length);
						$("#grade_totalstudent").text("검색결과 총 학생 수 : "+jsonData.list.length);
						$("#listbygrade tbody").text("");	//기존의 내용을 지운다.
		 				$.each(jsonData.list,function(index, mvo){
		 					member_table  = "<tr><td align='center'>"+mvo.name +"</td>"+
		 													"<td align='center'>"+mvo.hoperegion +"</td>"+
		 													"<td align='center'>"+mvo.grade +"</td>"+
		 													"<td align='center'>"+mvo.gender +"</td>"+
		 													"<td align='center'>"+mvo.hopesubject +"</td></tr>";	 													
							$("#grade_memberlist_Tbody").append(member_table);				
						});
						alert("이전페이지 : "+jsonData.pagingBean.previousPageGroup);
						alert("현재페이지 : "+jsonData.pagingBean.nowPage);
						alert("다음페이지 : "+jsonData.pagingBean.nextPageGroup);
					}
				});	//ajax	
			}	//if else
		});		
		
	});
</script>
<form id=grade_searchForm >
<table >
	<tr>
		<td>학년</td><td><select id="grade_grade" name="grade_grade"></select></td>
		<td>이름</td><td><input type="text" id="grade_name" name="grade_name"></td>
		<td align="right"><input type="button" id="grade_searchBtn" value="검색"> </td>		
	</tr>
</table>
</form>
<table width="560" cellpadding="2" cellspacing="0"><tr align="right"><td>
<div id="grade_totalstudent">총 학생 수 : ${requestScope.listVO.pagingBean.totalContent}</div>
</td></tr></table>	
<table id="listbygrade" width="560"  border="1" cellpadding="2" cellspacing="0">
	<thead>
		<tr><td width="20%" align="center">이름</td>
			<td width="20%" align="center">학교학년</td>
			 <td width="20%" align="center">성별</td>
			 <td width="20%" align="center">희망지역</td>
			 <td width="20%" align="center">희망과목</td>			 
		</tr>
	</thead>
	<tbody id="grade_memberlist_Tbody">
			<c:forEach var="mvo" items="${requestScope.listVO.list}" >		
			<tr>
			    <td align='center'><a href="#" id="studentName">${mvo.name }</a>
			    <input type="hidden" id="hidden_mvo" value="${mvo.id }"></td>
			    <td align='center'>${mvo.grade} </td>				
				<td align='center'>${mvo.gender}</td>
				<td align='center'>${mvo.hoperegion}</td>
				<td align='center'>${mvo.hopesubject}</td>
			</tr>
			</c:forEach>	
	</tbody>
</table><br>

<div id="dialog_studendInfo" title="개인정보">
<!-- 	 <p id="p_studentInfo">개인정보</p> -->
</div>

<table width="560"  cellpadding="2" cellspacing="0"><tr align="center"><td>
<div id="pagingView">
<c:set var="pb" value="${requestScope.listVO.pagingBean}"></c:set>
<c:if test="${pb.previousPageGroup}">
	<a href="tabGradeView.do?pageNo=${pb.startPageOfPageGroup-1 }">◀</a>
</c:if>	
&nbsp;&nbsp;
<c:forEach var="pageNo" begin="${pb.startPageOfPageGroup }" 
										end="${pb.endPageOfPageGroup }">
<c:choose>
<c:when test="${pb.nowPage !=pageNo }" >
<%-- 	<a href="tabGradeView.do?pageNo=${pageNo }" >${pageNo }</a> --%>
	<a id="pageList">${pageNo }</a>
</c:when>
<c:otherwise>
	${pageNo} 
</c:otherwise>
</c:choose>
</c:forEach>

<c:if test="${pb.nextPageGroup}">
	<a href="tabGradeView.do?pageNo=${pb.endPageOfPageGroup+1 }">▶ </a>
</c:if>
</div>
</td></tr></table>